<template>
  <div class="Success">恭喜，用户<span class="user">{{phone}}</span>注册成功<i class="iconfont icon-success"></i>马上跳转到首页</div>
</template>

<script>
import { mapState } from 'vuex'
export default {
  name: 'RegisterSuccess',
  computed: {
    ...mapState({
      phone: state => {
        return state.register.phone
      },
      password: state => {
        return state.register.password
      }
    })
  },
  mounted() {
    setTimeout(() => {
      this.$router.push('/hotel')
      localStorage.setItem('user_phone', this.phone)
      localStorage.setItem('user_password', this.password)
    }, 2000),
      this.$store.dispatch('registerInfo', {
        user_name: this.phone,
        user_phone: this.phone,
        user_password: this.password,
        user_avatar: 'https://dimg04.c-ctrip.com/images/Z80p180000013uw9yF21F.jpg'
      })
  }
}
</script>

<style lang="scss" scoped>
.Success {
  margin: 20px auto;
  width: 1000px;
  padding: 0 10px;
  min-height: 500px;
  line-height: 200px;
  font-size: 25px;
  text-align: center;
}
.user {
  color: #1afa29;
  font-size: 30px;
  font-weight: bold;
  margin: 0 10px;
}
.icon-success {
  font-size: 20px;
  color: #1afa29;
}
</style>